<template>
    <el-cascader :options="pcaTextArr" style="width:100%" v-model="selectedOptions" @change="handleChange"></el-cascader>
</template>

<script>
import { pcaTextArr } from 'element-china-area-data'
export default {
    data() {
        return {
            pcaTextArr,
            selectedOptions: [],
        }
    },
    mounted() {
        this.getRegion();//籍贯
    },
    methods: {
        // 行政区域接口-----------------
        getRegion() {
            this.$http.get(`/sys/region/tree`).then(({ data: res }) => {
                if (res.code !== 0) {
                    return this.$message.error(res.msg);
                }
                // 获取一级目录
                let oneArr = [], twoArr = []
                res.data.forEach(ele => {
                    if (ele.pid == 0) {
                        let obj = {};
                        obj.value = ele.id
                        obj.label = ele.name
                        obj.children = []
                        oneArr.push(obj)
                    } else {
                        twoArr.push(ele)
                    }
                });
                // 获取二级目录
                oneArr.forEach(it => {
                    twoArr.forEach(item => {
                        if (it.value == item.pid) {
                            let obj = {}
                            obj.value = item.id
                            obj.label = item.name
                            obj.children = [];
                            it.children.push(obj);
                        }
                    })
                });
                // 获取三级目录
                oneArr.forEach(it => {
                    it.children.forEach(its => {
                        twoArr.forEach(item => {
                            if (its.value == item.pid) {
                                let obj = {}
                                obj.value = item.id
                                obj.label = item.name
                                its.children.push(obj)
                            }
                        })
                    })
                });
                this.options = oneArr
            })
        },
        handleChange(value) {
            let arr = value.toString();
            this.$emit('child', arr);
        }
    }
}
</script>